<%@ taglib uri='http://java.sun.com/jsp/jstl/core' prefix='c' %>

<!--  
<c:url value="/createT.html" var="addUrl"/>
<c:url value="/deleteT.html" var="deleteUrl"/>
-->
<c:url value="/recordsT.html" var="recordsUrl"/>
<c:url value="/updateT.html" var="editUrl"/>
<c:url value="/recordsTraining.html" var="populateId"/>


<html>
<head>
	<link rel="stylesheet" href="css/stylekram.css" type="text/css" />
	<link rel="stylesheet" href="css/customkram.css" type="text/css" />
	<script type="text/javascript" src="js/jquery-1.6.js"></script>
	<script type="text/javascript" src="js/customTraining.js"></script>
	
	<title>Schedule Trainings</title>
	
	<script type='text/javascript'>
	$(function() {
		// init
		urlHolder.records = '${recordsUrl}';
		urlHolder.add = '${addUrl}';
		urlHolder.edit = '${editUrl}';
		urlHolder.del = '${deleteUrl}';
		urlHolder.popId = '${populateId}';
		loadTableT();
		
		$('#newBtnT').click(function() { 
			toggleFormsT('new');
			toggleCrudButtonsT('hide');
		});
		
		$('#editBtnT').click(function() { 
			
			if (hasSelectedT()) {
				
				toggleFormsT('edit');
				toggleCrudButtonsT('hide');
				fillEditFormT();
			}
		});
		
		$('#reloadBtnT').click(function() { 
			loadTableT();
		});

		$('#deleteBtnT').click(function() {
			if (hasSelectedT()) { 
				submitDeleteRecordT();
			}
		});
		
		$('#newFormT').submit(function() {
			event.preventDefault();
			submitNewRecordT();
		});
		
		$('#editFormT').submit(function() {
			event.preventDefault();
			//alert(submitUpdateRecordT);
			submitUpdateRecordT();
		});

		$('#closeNewFormT').click(function() { 
			toggleFormsT('hide'); 
			toggleCrudButtonsT('show');
		});
		
		$('#closeEditFormT').click(function() { 
			toggleFormsT('hide'); 
			toggleCrudButtonsT('show');
		});
	});
	</script>
</head>

<body>
	<div class="ui-jqgrid-titlebar ui-widget-header ui-corner-top ui-helper-clearfix">
		<a class="ui-jqgrid-titlebar-close HeaderButton" href="javascript:void(0)" role="link" style="right: 0px;">
		<span class="ui-icon ui-icon-circle-triangle-n"></span>
		</a>
	<span class="ui-jqgrid-title">Schedule Trainings</span>
</div>
	
	<table id='tableUsersT'>
		<caption></caption>
		<thead>
			<tr>
				<th></th>
				<th>Username</th>
				<th>First Name</th>
				<th>Last Name</th>
				<th>Training</th>
			</tr>
		</thead>
	</table>
	
	<div id='controlBarT'>
		<!--  <input type='button' value='New' id='newBtn' />
		<input type='button' value='Delete' id='deleteBtn' />
		<input type='button' value='Edit' id='editBtn' />
		<input type='button' value='Reload' id='reloadBtn' />
		-->
		<input type='button' value='Edit' id='editBtnT' />
	</div>
	
	<div id='newFormT'>
		<form>
  			<fieldset>
				<legend>Create New Record</legend>
				<label for='newUsername'>Username</label><input type='text' id='newUsernameT'/><br/>
				<label for='newPassword'>Password</label><input type='password' id='newPasswordT'/><br/>
				<label for='newFirstName'>First Name</label><input type='text' id='newFirstNameT'/><br/>
				<label for='newLastName'>Last Name</label><input type='text' id='newLastNameT'/><br/>
				<label for='newTraining'>Training</label>
					<select id='newTrainingT'>
						<option value='1'>T1</option>
						<option value='2' >T2</option>
						<option value='3' >T3</option>
						<option value='4'>T4</option>
						<option value='5' >T5</option>
						<option value='6' >T6</option>
						<option value='7'>T7</option>
						<option value='8' >T8</option>
						<option value='9' >T9</option>
						<option value='10' >T10</option>
					</select>
					
  			</fieldset>
			<input type='button' value='Close' id='closeNewFormT' />
			<input type='submit' value='Submit'/>
		</form>
	</div>
	
	<div id='editFormT'>
		<form>
  			<fieldset>
				<legend>Schedule Training</legend>
				<input type='hidden' id='editUsernameT'/>
				<input type='hidden' id='editFirstNameT'/>
				<input type='hidden' id='editLastNameT'/>
				<!--  <label for='editFirstName'>First Name</label><input type='text' id='editFirstNameT'/><br/>
				<label for='editLastName'>Last Name</label><input type='text' id='editLastNameT'/><br/>
				-->
				<label for='editTrainingT'>Training</label>
					<select id='editTrainingT'>
						<!-- <option value='1'>T1</option>
						<option value='2' >T2</option>
						<option value='3' >T3</option>
						<option value='4'>T4</option>
						<option value='5' >T5</option>
						<option value='6' >T6</option>
						<option value='7'>T7</option>
						<option value='8' >T8</option>
						<option value='9' >T9</option>
						<option value='10' >T10</option> -->
					</select>
					<input type='hidden' id='editRoleT' />	
					<input type='hidden' id='editProjectT' />		
					
			</fieldset>
			
			<input type='button' value='Close' id='closeEditFormT' />
			<input type='submit' value='Submit'/>
		</form>
	</div>
	
</body>
</html>